<template>
  <div class="app-container">
    <div class="filter-container">
      <el-input v-model="searchObj.data.person_number" size="medium" class="global-search-box" placeholder="员工编号"/>
      <el-input v-model="searchObj.data.real_name" size="medium" class="global-search-box" placeholder="员工姓名"/>
      <el-input v-model="searchObj.data.username" size="medium" class="global-search-box" placeholder="AD帐号"/>
      <el-input v-model="searchObj.data.department" size="medium" class="global-search-box" placeholder="部门"/>
      <el-select v-model="searchObj.data.gender" size="medium" placeholder="性别">
        <el-option v-for="item in genderSelect" :label="item.label" :key="item.value" :value="item.value"/>
      </el-select>
      <el-select v-model="searchObj.data.source" size="medium" placeholder="系统来源">
        <el-option v-for="item in sourceSelect" :label="item.label" :key="item.value" :value="item.value"/>
      </el-select>
      <el-select v-model="searchObj.data.available" size="medium" placeholder="状态">
        <el-option v-for="item in availableSelect" :label="item.label" :key="item.value" :value="item.value"/>
      </el-select>
      <el-input v-model="searchObj.data.emp_nature" size="medium" class="global-search-box" placeholder="用工性质"/>

      <el-button icon="el-icon-search" type="primary" size="medium" @click="search">搜索</el-button>
      <el-button type="primary" size="medium" @click="reset">重置</el-button>

      <el-button type="primary" size="medium" @click="addRole">新增员工</el-button>
      <el-dialog :visible.sync="addVisible" title="新增员工" width="600px">
        <el-form ref="addForm" :model="addFormValue" :rules="addFormValueRules" label-width="100px">
          <el-form-item label="用户名简称" prop="objec._short">
            <el-input v-model="addFormValue.objec._short"/>
          </el-form-item>
          <el-form-item label="用户名" prop="objec.stext">
            <el-input v-model="addFormValue.objec.stext"/>
          </el-form-item>
          <el-form-item label="开始时间" prop="objec.begda">
            <el-date-picker
              v-model="addFormValue.objec.begda"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="请选择开始日期"/>
          </el-form-item>
          <el-form-item label="结束时间" prop="objec.endda">
            <el-date-picker
              v-model="addFormValue.objec.endda"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="请选择结束日期"/>
          </el-form-item>
          <el-form-item label="绑定用户" prop="user_id">
            <el-select v-model="addFormValue.user_id" :filter-method="filterUserId" placeholder="可输入部门查找" filterable>
              <el-option
                v-for="item in getUserIdValue"
                :key="item.id"
                :value="item.id"
                :label="item.realName"
              />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button @click="cancelAdd('addForm')">取 消</el-button>
            <el-button type="primary" @click="confirmAdd('addForm')">确 定</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
      <el-button type="success" size="medium" >模版下载</el-button>
      <el-button type="success" size="medium" >导入</el-button>
      <el-button type="success" size="medium" >导出</el-button>
    </div>
    <el-table
      v-loading="listLoading"
      :data="listData"
      element-loading-text="Loading"
      fit
      border
      highlight-current-row
    >
      <el-table-column prop="person_number" label="员工编号" min-width="100"/>
      <el-table-column prop="real_name" label="员工姓名" min-width="150"/>
      <el-table-column prop="username" label="系统帐号"/>
      <el-table-column prop="department" label="部门"/>
      <el-table-column prop="gender" label="性别"/>
      <el-table-column prop="source" label="系统来源"/>
      <el-table-column prop="emp_nature" label="用工性质"/>
      <el-table-column label="状态">
        <template slot-scope="scope">
          <span>{{ scope.row.available === true ? '可用' : '禁用' }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" min-width="280">
        <template slot-scope="scope">
          <el-button type="success" size="mini" @click="goEmployeeInfo(scope.row,'detail')">明细</el-button>
          <el-button type="primary" size="mini" icon="el-icon-edit" @click="goEmployeeInfo(scope.row,'edit')">编辑</el-button>
          <el-button v-if="scope.row.source==='HRSSP'" type="warning" size="mini" @click="disRole(scope.row)">{{ scope.row.available?'禁用':'激活' }}</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="global-paging">
      <el-pagination
        :page-size="10"
        :total="total"
        :current-page.sync="searchObj.currentNo"
        :page-sizes="[10, 20, 40]"
        background
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script>
import commonApi from '@/api/commonApi'
export default {
  name: 'EmployeeManage',
  data() {
    return {
      listLoading: false,
      listData: [], // 表格数据
      total: null, // 总列表条数
      addVisible: false, // 新增员工状态
      sourceSelect: [{
        value: 'HRSSP',
        label: 'HRSSP'
      }, {
        value: 'SAP',
        label: 'SAP'
      }],
      genderSelect: [
        {
          value: '男',
          label: '男'
        }, {
          value: '女',
          label: '女'
        }
      ],
      availableSelect: [
        {
          value: true,
          label: '可用'
        }, {
          value: false,
          label: '禁用'
        }
      ],
      // 搜索列表条件
      searchObj: {
        currentNo: 1,
        pageSize: 10,
        data: {
          person_number: '',
          real_name: '',
          username: '',
          department: '',
          gender: '',
          source: '',
          emp_nature: '',
          available: null
        }
      },
      addFormValue: {
        objec: {
          _short: '',
          stext: '',
          begda: '',
          endda: '',
          otype: 'P'
        },
        user_id: ''
      }, // 添加员工表单数据
      addFormValueRules: {
        objec: {
          _short: [
            { required: true, message: '请输入用户名简称', trigger: 'blur' }
          ],
          stext: [
            { required: true, message: '请输入用户名', trigger: 'blur' }
          ],
          begda: [
            { required: true, message: '请选择开始时间', trigger: 'change' }
          ],
          endda: [
            { required: true, message: '请选择结束时间', trigger: 'change' }
          ]
        },
        user_id: [
          { required: true, message: '请选择用户', trigger: 'change' }
        ]
      }, // 添加员工表单数据规则
      searchUserId: {
        currentNo: 1,
        pageSize: 100,
        data: {
          username: '',
          // real_name:"",
          department: ''
          // is_valid:'',
          // user_type:'',
        }
      },
      getUserIdValue: []// 获取user_id的下拉值
    }
  },
  created() {
    this.getListData()
  },
  methods: {
    // 点击明细事件
    goEmployeeInfo(row, event) {
      if (row.source === 'SAP') {
        this.$router.push({ name: 'EmployeeInfo',
          params: {
            personNumber: row.person_number, // 员工编号
            real_name: row.real_name, // 员工姓名
            source: row.source, // 系统来源
            available: row.available, // 状态
            event, // 传是点击明细还是编辑事件
            tabs: [
              {
                id: '1',
                text: '工作岗位分配（多条）',
                apiUrl: '/organization/queryPositionByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'code',
                    label: '岗位编码'
                  }, {
                    field: 'stext',
                    label: '岗位名称'
                  }, {
                    field: 'vprozt',
                    label: '岗位百分比'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'endda',
                    label: '结束时间'
                  }
                ]
              }, {
                id: '0000',
                text: '人事事件（SAP多条）',
                apiUrl: '/person/queryPersonnelByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'massn',
                    label: '操作类型'
                  }, {
                    field: 'massg',
                    label: '操作原因'
                  }, {
                    field: 'personNumber',
                    label: '人员编号'
                  }
                ]
              }, {
                id: '0001',
                text: '组织分配（SAP多条）',
                apiUrl: '/person/queryAssignmentByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'bukrs',
                    label: '公司代码'
                  }, {
                    field: 'werks',
                    label: '人事范围'
                  }, {
                    field: 'btrtl',
                    label: '人事子范围'
                  }, {
                    field: 'persg',
                    label: '员工组'
                  }, {
                    field: 'persk',
                    label: '员工子组'
                  }, {
                    field: 'vdsk1',
                    label: '组织代码'
                  }, {
                    field: 'gsber',
                    label: '业务范围'
                  }, {
                    field: 'abkrs',
                    label: '工资范围'
                  }, {
                    field: 'orgeh',
                    label: '组织单位'
                  }, {
                    field: 'plans',
                    label: '职务'
                  }, {
                    field: 'prozt',
                    label: '权重百分比'
                  }, {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'personNumber',
                    label: '人员编号'
                  }
                ]
              }, {
                id: '0002',
                text: '个人信息（SAP单条）',
                apiUrl: '/person/queryPersonnalInfoByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'pernr',
                    label: '人员编号'
                  }, {
                    field: 'ename',
                    label: '员工或申请人的格式姓名'
                  }, {
                    field: 'gesch',
                    label: '性别'
                  }, {
                    field: 'gbdat',
                    label: '出生日期'
                  }, {
                    field: 'z00Hrjg',
                    label: '籍贯'
                  }, {
                    field: 'natio',
                    label: '国际'
                  }, {
                    field: 'konfe',
                    label: '宗教'
                  }, {
                    field: 'famst',
                    label: '婚姻状况'
                  }, {
                    field: 'anzkd',
                    label: '子女数目'
                  }, {
                    field: 'z00Hrrsqgl',
                    label: '入司前工龄'
                  }, {
                    field: 'personNumber',
                    label: '人员编号（本系统外键约束）'
                  }
                ]
              }, {
                id: '0007',
                text: '计划工作时间（SAP单条）',
                apiUrl: '/person/queryClockInByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'schkz',
                    label: '工作日程表规则'
                  }, {
                    field: 'zterf',
                    label: '雇员时间管理状态'
                  }, {
                    field: 'empct',
                    label: '就业百分比'
                  }, {
                    field: 'mostd',
                    label: '月时数'
                  }, {
                    field: 'wostd',
                    label: '每周时数'
                  }, {
                    field: 'arbst',
                    label: '日工作小时数'
                  }, {
                    field: 'wkwdy',
                    label: '每周工作天数'
                  }, {
                    field: 'jrstd',
                    label: '月工作小时数'
                  }, {
                    field: 'personNumber',
                    label: '人员编号'
                  }
                ]
              }, {
                id: '0105',
                text: '通讯（SAP单条）',
                apiUrl: '/person/queryCommunicationInfoByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'usrty',
                    label: '通讯类型'
                  }, {
                    field: 'usrid',
                    label: '通讯标识/编号'
                  }, {
                    field: 'personNumber',
                    label: '人员编号'
                  }
                ]
              }, {
                id: '0185',
                text: '证件信息（SAP单条）',
                apiUrl: '/person/queryIdentityInfoByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'endda',
                    label: '结束时间'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'ictyp',
                    label: '证件类型'
                  }, {
                    field: 'icnum',
                    label: '身份证号'
                  }, {
                    field: 'auth1',
                    label: '签发机构'
                  }, {
                    field: 'usefr',
                    label: '使用开始日期'
                  }, {
                    field: 'useto',
                    label: '使用截止日期'
                  }, {
                    field: 'personNumber',
                    label: '人员编号'
                  }
                ]
              }
            ]
          }})
      } else if (row.source === 'HRSSP') {
        this.$router.push({ name: 'EmployeeInfo',
          params: {
            personNumber: row.person_number, // 员工编号
            real_name: row.real_name, // 员工姓名
            source: row.source, // 系统来源
            available: row.available, // 状态
            event, // 传是点击明细还是编辑事件
            tabs: [
              {
                id: '1',
                text: '工作岗位分配（多条）',
                apiUrl: '/organization/queryPositionByPersonNumber/',
                listFormTitle: [
                  {
                    field: 'code',
                    label: '岗位编码'
                  }, {
                    field: 'stext',
                    label: '岗位名称'
                  }, {
                    field: 'vprozt',
                    label: '岗位百分比'
                  }, {
                    field: 'begda',
                    label: '开始时间'
                  }, {
                    field: 'endda',
                    label: '结束时间'
                  }
                ]
              }, {
                id: '2',
                text: '第三方人员扩展字段（HRSSP单条）',
                apiUrl: '/personExtentionInfo/queryPersonExtentionInfoByPersonNumebr/',
                listFormTitle: [
                  {
                    field: 'personNumber',
                    label: '人员编号'
                  }, {
                    field: 'real_name',
                    label: '真实姓名'
                  }, {
                    field: 'identity_card',
                    label: '身份证'
                  }, {
                    field: 'company',
                    label: '公司'
                  }, {
                    field: 'hiredate',
                    label: '入职日期'
                  }, {
                    field: 'birthday',
                    label: '生日'
                  }, {
                    field: 'type',
                    label: '员工类型'
                  }, {
                    field: 'create_date',
                    label: '创建日期'
                  }, {
                    field: 'modify_date',
                    label: '修改日期'
                  }, {
                    field: 'create_user',
                    label: '创建者'
                  }, {
                    field: 'last_modify_user',
                    label: '最后修改者'
                  }
                ]
              }
            ]
          }})
      }
    },
    // 获取列表数据
    getListData() {
      this.listLoading = true
      commonApi('/person/personPageList', 'post', this.searchObj).then(response => {
        this.listData = response.data.rows
        this.total = response.data.total
        this.listLoading = false
      })
    },
    // 筛选数据来源是HRSSP的，才提供禁用的功能
    selectable(row, index) {
      if (row.source === 'HRSSP') {
        return true
      } else {
        return false
      }
    },
    // 统一更改状态的方法
    updateVisible(visible) {
      this[visible] = !this[visible]
    },
    // 点击搜索按钮
    search() {
      this.searchObj.currentNo = 1
      this.getListData()
    },
    // 点击重置按钮
    reset() {
      for (const index in this.searchObj.data) {
        this.searchObj.data[index] = ''
        this.searchObj.data.available = null
      }
      this.getListData()
    },
    // 点击新增员工按钮
    getUserIdList() {
      this.listLoading = true
      commonApi('/user/queryUserByCondition', 'post', this.searchUserId).then(response => {
        this.getUserIdValue = response.data.rows
        this.listLoading = false
      })
    },
    // 添加员工表单中的输入框
    filterUserId(e) {
      this.searchUserId.data.department = e
      this.getUserIdList()
    },
    addRole() {
      this.updateVisible('addVisible')
      this.getUserIdList()
    },
    // 点击取消新增员工
    cancelAdd(formName) {
      this.updateVisible('addVisible')
      this.$refs[formName].clearValidate()
    },
    // 点击确定新增员工
    confirmAdd(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.listLoading = true
          commonApi('/organization/addOrganization', 'post', this.addFormValue).then(response => {
            this.listLoading = false
            this.updateVisible('addVisible')
            // 重新获取列表数据
            this.getListData()
          }).catch(err => {
            console.log(err)
          })
        } else {
          return false
        }
      })
    },
    // 分页大小改变
    handleSizeChange(val) {
      this.searchObj.pageSize = val
      this.getListData()
    },
    // 当前页改变
    handleCurrentChange(val) {
      this.searchObj.currentNo = val
      this.getListData()
    },
    // 禁用
    disRole(row) {
      this.listLoading = true
      const marked = row.available ? '禁用成功' : '激活成功'
      commonApi('/organization/disable', 'post', {
        available: !row.available,
        code: row.person_number + 'P'
      }).then(response => {
        this.listLoading = false
        this.$message(marked)
        this.getListData()
      })
    }
  }
}
</script>

<style scoped>
  .test{}
</style>
